<!--A Design by W3layouts
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE HTML>
<html>
<head>
<title>The Steam for Iphone, Android & Smartphone Mobile Website Template | Album :: w3layouts</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Steam Iphone web template, Andriod web template, Smartphone web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(
hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href="smartphone/css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href='http://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Dosis' rel='stylesheet' type='text/css'>
<script src="smartphone/js/mobile.js"></script>
</script><script type="text/javascript">window.onload = function() { w3Init(); };</script>
</head>
<body>
<div class="wrap"> 	
   <div class="header">	
        <ul id="logo">
    		<a href="index.html"><img src="smartphone/images/logo.png" alt=""></a>
    	</ul>
    	<div id="w3-mobile-options">
    		<li id="w3-menu-trigger" class=" ">
    			<a href="">Menu</a></li>
    			<li id="w3-search-trigger" class=" ">
    				<a href="login.html"></a>
    			</li>
    	 </div>
    		<ul id="w3-menu-links" style="display: none;" class=" ">
    			<li><a href="index.html">Home</a></li>
				<li><a href="start.html"><span>Get Started</span></a></li>
				<li><a href="work.html"><span>How it Works</span></a></li>
				<li><a href="pricing.html">Pricing</a></li>
				<li><a href="support.html">Support</a></li>
				<li><a href="404.html">404</a></li> 
    		</ul>
    		<h2 class="head">Find the <span class="m_1">next event </span>You'll want <span class="m_1">to attend</span></h2>
     </div>
  <div class="main">
      <h4 class="m_6">Album</h4>
     	<p class="m_7">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
     	<img src="smartphone/images/album.jpg" alt=""/>
     	<div class="album-desc">
     	   <h3 class="m_8">consectetuer adipiscing elit</h3>
     	   <span class="m_9">Release date:12-02-2014</span>
     	    <h4 class="m_10">This Album is now available</h4>
     	</div>
            <h4 class="m_6">Album Description</h4>
	     	<p class="m_11">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
	     	
	     		<div class="track">
	        <h4 class="m_6">Album Tracks</h4>
       		<ul class="songs">
				<li>
				   <div class="track-nr">1</div>
				   <div class="track-meta">
						<h5><a href="#">Nobody Move</a></h5>
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,..</p>
				   </div>
				   <ul class="track-btns">
					  <li><a href="#" class="download-track">Download Track</a></li>
					  <li><a href="#" class="buy-track">Buy Track</a></li>
				  </ul>
			   </li>
			   <li>
				   <div class="track-nr">2</div>
				   <div class="track-meta">
						<h5><a href="#">Miss Kitten</a></h5>
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,..</p>
				   </div>
			  </li>
			  <li>
				   <div class="track-nr">3</div>
				   <div class="track-meta">
						<h5><a href="#">Ignissim Congue</a></h5>
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,..</p>
				   </div>
				   <ul class="track-btns">
						<li><a href="#" class="buy-track">Buy Track</a></li>
				   </ul>
			  </li>
			  <li>
				 <div class="track-nr">4</div>
                 <div class="track-meta">
			       <h5><a href="#">Risus et Justo</a></h5>
				   <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,..</p>
				</div>
			  </li>
			  <li>
				 <div class="track-nr">5</div>
				 <div class="track-meta">
					<h5><a href="#">Mauris</a></h5>
					<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,..</p>
				 </div>
				 <ul class="track-btns">
					<li><a href="#" class="download-track">Download Track</a></li>
				 </ul>
			  </li>
			  <li>
				 <div class="track-nr">6</div>
				 <div class="track-meta">
					<h5><a href="#">Pulvinar</a></h5>
					<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit,..</p>
				 </div>
				 <ul class="track-btns">
					<li><a href="#" class="buy-track">Buy Track</a></li>
				 </ul>
			 </li>
		</ul>
        </div> 
         <h4 class="m_6">Featured Albums</h4>
		   <div class="section group">
		   	   <div class="col_1_of_3 span_1_of_3">
				   <div class="container1 right">
						<img src="smartphone/images/s14.jpg" alt="image">
						<article class="text css3-4">
							<h1><a href="#" class="css3-4">Thailand</a></h1>
						</article>
					</div>
				</div>
				 <div class="col_1_of_3 span_1_of_3">
				   <div class="container1 right">
						<img src="smartphone/images/s15.jpg" alt="image">
						<article class="text css3-4">
							<h1><a href="#" class="css3-4">Thailand</a></h1>
						</article>
					</div>
				</div>
				 <div class="col_1_of_3 span_1_of_3">
				   <div class="container1 right">
						<img src="smartphone/images/s16.jpg" alt="image">
						<article class="text css3-4">
							<h1><a href="#" class="css3-4">Thailand</a></h1>
						</article>
					</div>
				</div>
				<div class="clear"></div>	
			</div>
      </div>
      <div class="footer">
     	  <div class="footer-menu">
     		<ul>
				<li class="active"><a href="index.html">Home</a></li> 
				<li><a href="about.html">About eco</a></li> 
				<li><a href="industries.html">Industries</a></li> 
				<li><a href="features.html">Features</a></li>
				<li><a href="faq.html">Faq's</a></li>
				<li><a href="blog.html">Blog</a></li>
				<li><a href="work.html">Terms of service</a></li>
				<div class="clear"></div>
			</ul>
     	  </div>
     	  <div class="footer-bottom">
     	  	<div class="copy">
			   <p>© 2014 Template by <a href="http://w3layouts.com" target="_blank"> w3layouts</a></p>
		    </div>
		    <div class="social">	
			   <ul>	
				  <li class="facebook"><a href="#"><span> </span></a></li>
				  <li class="twitter"><a href="#"><span> </span></a></li>
				  <li class="linked"><a href="#"><span> </span></a></li>	
				  <li class="arrow"><a href="#"><span> </span></a></li>	
				  <li class="dot"><a href="#"><span> </span></a></li>
				  <li class="rss"><a href="#"><span> </span></a></li>		
			   </ul>
		    </div>
		    <div class="clear"></div>
     	  </div>
       </div>
   </div>
</body>
</html>
